<!DOCTYPE html >
<html>
<head>
    <base>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <title>财务明细</title>
    <link rel="stylesheet" href="../../../res/layui/css/layui.css" media="all">
    <style>
        body {
            margin: 10px;
        }

        #money {
            color: red;
            font-size: 120%;
            text-align: center;
        }
    </style>
</head>
<body>
<div class="demoTable">

    时间：
    <div class="layui-input-inline">
        <input name="date" id="date" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input"
               type="text">
    </div>
    ——
    <div class="layui-input-inline">
        <input name="date" id="date1" lay-verify="date" placeholder="yyyy-MM-dd" autocomplete="off" class="layui-input"
               type="text">
    </div>
    公司：
    <div class="layui-inline layui-form" style="width:130px">
        <select name="shzt" id="shzt"
                autocomplete="off" class="layui-input">

        </select>
    </div>
    <div class="layui-inline layui-form" style="width:130px">
        <select name="state" id="state"
                autocomplete="off" class="layui-input">
            <option value="">支出/收入</option>
            <option value="2">支出</option>
            <option value="1">收入</option>
        </select>
    </div>
    公司金额:
    <div class="layui-inline layui-form" style="width:130px">
        <input type="text" id="money" value="99999" class="layui-input" disabled>
    </div>
    　
    <button class="layui-btn" data-type="reload">搜索</button>
</div>
<table class="layui-hide" id="goods" lay-filter="demo"></table>

<script type="text/html" id="xx">
    <a class="layui-btn layui-btn-xs" lay-event="chakan" id="dindanxx">查看订单详情</a>
</script>

<script src="../../../res/layui-v2.5.6/layui.js"></script>
<script src="../../../res/js/util.js"></script>
<script>
    var openIndex = null;
    var table = null;
    layui.use(['form', 'laydate', 'laypage', 'layer', 'table', 'upload', 'element'], function () {
        table = layui.table;
        var laydate = layui.laydate //日期
            , laypage = layui.laypage //分页
            , layer = layui.layer //弹层
            //, table = layui.table //表格
            , upload = layui.upload //上传
            , form = layui.form
            , element = layui.element; //元素操作

        //日期
        laydate.render({
            elem: '#date'
        });
        laydate.render({
            elem: '#date1'
        });

        //监听Tab切换
        element.on('tab(demo)', function (data) {
            layer.msg('切换了：' + this.innerHTML);
            console.log(data);
        });
        let $ = layui.$;
        $.ajax({
            url: getRootPath() + 'hqRicher/showGs',
            data: null,
            dataType: 'json',
            async: false,//同步
            type: 'post',
            success: function (obj) {
                var data = returnUser();
                if (data.companyId === "0") {
                    $("#shzt").append('<option value="">总公司</option>')
                }
                $.each(obj, function (index, item) {
                    if (data.companyId === "0") {
                        $("#shzt").append("<option value=" + item.immId + ">" + item.immName + "</option>");
                    }else if (data.companyId === item.immId){
                        $("#shzt").append("<option value=" + item.immId + ">" + item.immName + "</option>");
                    }
                })
                //渲染
                form.render('select');
            },
            error: function () {

            }
        })
        //执行一个 table 实例
        table.render({
            elem: '#goods'
            , height: 474
            , url: getRootPath() + 'hqRicher/showAll' //数据接口
            , page: true //开启分页
            ,totalRow: true  //开启合计
            , method: 'post'
            , cols: [[ //表头
                //{type: 'checkbox', fixed: 'left'}
                //{field: 'chargeoffId', title: '财务明细Id', width: 100, fixed: 'left', align: 'center'}
                {field: 'state', title: '支出/收入', width: 120, align: 'center', templet: function (d) {
                        return d.state === 2 ? "支出" : "收入";
                    }, totalRowText: '合计'
                },{field: 'chargeoffMoney', title: '明细金额', width: 120, align: 'center', totalRow: true}
                , {field: 'remark', title: '明细备注', width: 160, align: 'center'}
                , {field: 'operator', title: '操作人', width: 120, align: 'center'}
                , {field: 'optime', title: '操作时间', width: 160, align: 'center'}
                , {fixed: 'right', title: '查询信息', width: 210, align: 'center', toolbar: '#xx'}
            ]]
            , id: 'testReload'
            , parseData: function (res) {//res 即为原始返回的数据
                if (res.data[0] !== undefined) {
                    $("#money").val(res.data[0].money)
                }
                let jin = null;
                let chu = null;
                $.each(res.data,function(index,item){
                		if (item.state===1){
                            jin+=item.chargeoffMoney
                        }else {
                            chu+=item.chargeoffMoney
                        }
                });
                return {
                    "code": res.code, //解析接口状态
                    "count": res.count, //解析数据长度
                    "msg":res.msg,
                    "data":res.data,
                    "totalRow":{
                        chargeoffMoney:jin-Math.round(chu*100)/100
                    }
                };
            },where:{
                immId:$("#shzt").val()
            }
        });

        //监听工具条
        table.on('tool(demo)', function (obj) { let id;
//注：tool是工具条事件名，test是table原始容器的属性 lay-filter="对应的值"
            var data = obj.data //获得当前行数据
                , layEvent = obj.event; //获得 lay-event 对应的值
            console.info(data);
            if (layEvent === 'del') {
                //删除
                id = data.purchaseId;
                layer.confirm('确认删除？', function (index) {
                    //使用jquery的ajax方式向后台提交数据
                    const url = getRootPath() + 'hqPurchaseorder/deletes';
                    const data = {purchaseId: id};
                    $.ajax({
                        asyn: true,
                        type: "delete",
                        url: url,
                        data: data,
                        success: function (res) {
                            if (res.status === 20) {
                                layer.msg(res.message, {
                                    icon: 1,
                                    time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                }, function () {
                                    obj.del(); //删除对应行（tr）的DOM结构
                                    layer.close(index);
                                });
                            } else {
                                layer.msg(res.message, {
                                    time: 1000 //1秒关闭（如果不配置，默认是3秒）
                                }, function () {
                                    layer.close(index);
                                });
                            }
                        },
                        error: function (fh) {
                            layer.msg(fh.message, {
                                time: 1000 //1秒关闭（如果不配置，默认是3秒）
                            }, function () {
                                layer.close(index);
                            });
                        }
                    }, "json");
                });
            } else if (layEvent === 'edit') {
                //修改
                id = data.purchaseId;
                const urls = "purchaseUpdate.html?purchaseId=" + id;
                openIndex = layer.open({
                    type: 2,
                    area: ['80%', '90%'],//弹出框大小
                    shift: 1,//弹出框动画效果
                    content: [urls, 'on'] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
                });
            } else if (layEvent === 'chakan') {
                console.info(data);
                //查看原材料
                if(data.purchaseId!=null){
                    const url = "purchasedetails.html?purchaseId=" + data.purchaseId;
                    layer.open({
                        type: 2,
                        area: ['76%', '75%'],//弹出框大小
                        shift: 1,//弹出框动画效果
                        content: [url, 'on'] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
                    });
                }else{
                    id = data.drugId;
                    console.info(returnUser());
                    if (returnUser().companyId!=="0"){
                        openIndex = layer.open({
                            type: 2,
                            skin: 'layui-layer-rim', //加上边框
                            area: ['75%', '75%'], //宽高
                            title: '采购明细',
                            maxmin: true, //开启最大化最小化按钮
                            content: '../ImmSell/wholesale.html?sellId=' + id,
                        });
                    }else {
                        openIndex = layer.open({
                            type: 2,
                            skin: 'layui-layer-rim', //加上边框
                            area: ['75%', '75%'], //宽高
                            title: '采购明细',
                            maxmin: true, //开启最大化最小化按钮
                            content: '../immPurchase/immPurchaseDeatis.html?id=' + id,
                        });
                    }
                }

            }
        });

        //条件查询
        $ = layui.$;

        $('.demoTable .layui-btn').on('click', function () {
            //执行重载
            table.reload('testReload', {
                page: {
                    curr: 1
                    //重新从第 1页开始
                },
                where: {
                    startTime: $("#date").val(),
                    overTime: $("#date1").val(),
                    immId: $("#shzt").val(),
                    state: $("#state").val()
                }
            });
        });
        $('#imgAdd').on('click', function () {
            openIndex = layer.open({
                type: 2,
                area: ['80%', '90%'],//弹出框大小
                shift: 1,//弹出框动画效果
                content: ['purchaseorderAdd.html', 'on'] //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
            });
        });

    });

    /**
     * 关闭层
     * @param msg 返回信息
     */
    function closeOpen(msg) {
        layer.close(openIndex);
        layer.msg(msg, {time: 1500})
        table.reload("testReload");//刷新表格
    }

    function closeOpens() {
        table.reload("testReload");//刷新表格
    }


</script>
</body>
</html>